<template>
  <div class="about">

    <el-descriptions title="" v-for="(item,index) in arr" :key="index" style="padding-top: 45px;">
      <el-descriptions-item label="公告ID">{{ item.nid }}</el-descriptions-item>
      <el-descriptions-item label="标题">{{ item.ntitle }}</el-descriptions-item>
      <el-descriptions-item label="内容">{{ item.ncontext }}</el-descriptions-item>
      <el-descriptions-item label="时间">
        <el-tag size="small">{{ item.ntime }}</el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="配图">
        <img :src="item.image" alt="" style="width: 30px; height: 30px">
      </el-descriptions-item>
    </el-descriptions>
    <div style="padding: 10px 0;">
            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageNum"
                :page-sizes="[5, 10, 15]" :page-size="10" layout="total, sizes, prev, pager, next, jumper" :total="total">
            </el-pagination>
    </div>
    <!-- <el-descriptions
      class="margin-top"
      title="垂直无边框列表"
      :column="4"
      direction="vertical"
    >
      <el-descriptions-item label="用户名">kooriookami</el-descriptions-item>
      <el-descriptions-item label="手机号">18100000000</el-descriptions-item>
      <el-descriptions-item label="居住地" :span="2"
        >苏州市</el-descriptions-item
      >
      <el-descriptions-item label="备注">
        <el-tag size="small">学校</el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="联系地址"
        >江苏省苏州市吴中区吴中大道 1188 号</el-descriptions-item
      >
    </el-descriptions> -->
  </div>
</template>

<script>
import axios from "axios";

export default {
  name: "User",
  data() {
    return{
      size: "",
      arr:[],
      pageNum: 1,
      pageSize: 10,
      total: 0,
    }

  },
  created(){
    this.load();
  },
  methods: {
    load(){
      var param=new URLSearchParams();
      param.append("page",this.pageNum);
      param.append("size",this.pageSize);
      axios({
        url:"http://localhost:8080/notice/getNoticePage",
        method:"get",
        params:param
      }).then(res=>{
        this.arr=res.data.records;
        this.total=res.data.total;
        console.log(res);
      })
    },
    handleSizeChange(pageSize) {
            
            this.pageSize = pageSize;
            this.load();
        },


        handleCurrentChange(pageNum) {
            
            this.pageNum = pageNum;
            this.load();
        },
  },
};
</script>
